
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>后台管理系统</title>
    <meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" name="viewport"/>
    <meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible"/>
    <meta name="renderer" content="webkit"/>
    <meta name="HandheldFriendly" content="true"/>
    <meta name="format-detection" content="telephone=no, email=no"/>
    <link rel="stylesheet" href="/static/layui/css/layui.css">
    <link rel="stylesheet" href="/static/css/admin/login.css">
    <script type="text/javascript" src="/static/js/jquery.js"></script>
    <script src="/static/layui/layui.js"></script>
</head>
<body class="woo-global-body login ">
<div class="cover-bg">
    <div class="bg"></div>
</div>
<div class="container ready">
    <div class="login-left">
        <div class="thumb b b1"><img src=" https://cdn.jsdelivr.net/gh/yaoGrace/CdnStatics/cdnImgs/phpgrace/login-box-bg.svg" alt=""></div>
        <h2 class="b b2">后台管理系统</h2>
        <h4 class="en-font b b3">Management System</h4>
    </div>
    <div class="login-right sizing">
        <h2 class="word s s1">登录</h2>
        <h2 class="title s s1">后台管理系统</h2>
        <h4 class="en-font en-title s s2">Management System</h4>
        <div class="form-item s s2">
            <label for="username"><i class="layui-icon layui-icon-username"></i></label>
            <input type="text" name="username" id="username" value="demo@demo.com" class="en-font sizing" placeholder="请输入邮箱" autocomplete="off">
            <div class="error-tip">请输入邮箱</div>
        </div>
        <div class="form-item s s3">
            <label for="password"><i class="layui-icon layui-icon-password"></i></label>
            <input type="password" name="password" id="password" value="123456" class="en-font sizing" placeholder="请输入密码" autocomplete="off">
            <div class="error-tip">请输入密码</div>
        </div>
        <div class="form-item s s4">
            <label for="captcha"><i class="layui-icon layui-icon-vercode"></i></label>
            <input type="text" name="captcha" id="captcha" class="en-font sizing" placeholder="输入验证码" autocomplete="off">
            <span class="vimg">
                    <img src="<?php echo u('login','vcode')?>" id="captchaimg" onclick="this.src='<?php echo u('login','vcode')?>?'+Math.random()"/>
                </span>
            <div class="error-tip">请输入验证码</div>
        </div>
        <div class="sub">
            <input type="submit" class="sizing s s5" id="loginSubmit" value="登录"/>
        </div>
        <div class="copy s s6"><a href="javascript:;" > 登录页面　精心铸造应用管理系统</a></div>
    </div>
</div>

<script>
layui.use(['form','layer'],function () {
    var form = layui.form,layer = layui.layer;
});
$('.container').removeClass('ready');

$('.form-item').find('input').focus(function () {
    $(this).parent().addClass('focus');
}).blur(function () {
    $(this).parent().removeClass('focus');
    if ($.trim($(this).val())) {
        $(this).parent().removeClass('error');
    } else {
        $(this).parent().addClass('error');
    }
}).keyup(function () {
    if ($.trim($(this).val())) {
        $(this).parent().removeClass('error');
    } else {
        $(this).parent().addClass('error');
    }
})

$('body').keydown(function (e) {
    if (e.keyCode == 13) {
        $('#loginSubmit').trigger('click');
    }
});

$('#loginSubmit').click(function () {
    var username = $.trim($('#username').val());
    var password = $.trim($('#password').val());
    var captcha = $.trim($('#captcha').val());
    var ischeck = true;
    if (!username) {
        $('#username').parent().addClass('error');
        ischeck = false;
    }
    if (!password) {
        $('#password').parent().addClass('error');
        ischeck = false;
    }

    if (!ischeck) {
        layer.msg('请按提示输入登录信息' );
        return false;
    }
    var index = layer.load(2, {
        time : 2000
    }) ;

    $.post("<?php echo u('login','logincheck');?>", {
        email : username,
        password : password,
        vercode :captcha
    }, function (data) {
        layer.close(index);
        var json = JSON.parse(data);
        if (json.status == '200') {
            layer.msg(json.data.msg,{icon: 6});
            setTimeout(function () {
                location.href =  json.data.home;
            }, 800)
        } else {
            $('#captchaimg').trigger('click');
            layer.msg(json.data,{icon:2,time:1000} );
        }
    })
})
</script>
<div id="fixedAlert"></div>
</body>
</html>